<!--created by han.wen@dhc.com.cn-->
<ion-view view-title="单选与多选">
  <ion-content>
    <div class="padding">
      <div class="indent">单选与多选均有多种呈现形式，下面就介绍几种常见的。</div>
      <div class="padding-top-10 border-top">请选择单选或多选</div>
      <div class="padding-bottom-10 border-bottom">
        <span ng-click="modeSelect(true);"><i class="dhcfont assertive font-size-l" ng-bind="mode.isSingle?'&#xe602;':'&#xe612;'"></i>单选</span>
        <span ng-click="modeSelect(false);"><i class="dhcfont assertive font-size-l" ng-bind="!mode.isSingle?'&#xe602;':'&#xe612;'">&#xe602;</i>多选</span>
      </div>
      <div class="padding-top-bottom-10">列表单选/多选</div>
      <div class="border padding-10" ng-class="{true:'border-bottom-none'}[$index<data.length-1]" ng-repeat="item in data" ng-click="select($index);">
        <span ng-bind="item"></span>
        <i class="dhcfont absolute right-20" ng-bind="isSelected[$index]?'&#xe62f;':''"></i>
      </div>
      <div class="margin-top-10"></div>
      <div class="border-top border-left-right padding-10" ng-if="!mode.isSingle" ng-click="totalSelect();">
        <i class="dhcfont" ng-bind="data1TotalSelected?'&#xe638;':'&#xe637;'"></i>
        <span>全选</span>
      </div>
      <div class="border padding-10" ng-class="{true:'border-bottom-none'}[$index<data1.length-1]" ng-repeat="item in data1" ng-click="select($index);" ng-if="!mode.isSingle">
        <i class="dhcfont" ng-bind="isSelected[$index]?'&#xe638;':'&#xe637;'"></i>
        <span ng-bind="item"></span>
      </div>
      <div class="border-top margin-top-10 padding-top-bottom-10">条件单选/多选</div>
      <div ng-if="mode.isSingle">
        <!--<div>条件单选</div>-->
        <span ng-repeat="item in data" ng-click="select($index);">
          <i class="dhcfont" ng-bind="isSelected[$index]?'&#xe602;':'&#xe612;'"></i>
          <span ng-bind="item"></span>
        </span>
      </div>
      <div ng-if="!mode.isSingle">
        <!--<div>条件多选</div>-->
        <span ng-repeat="item in data" ng-click="select($index);">
          <i class="dhcfont" ng-bind="isSelected[$index]?'&#xe638;':'&#xe637;'"></i>
          <span ng-bind="item"></span>
        </span>
      </div>

      <div class="border-top margin-top-10 padding-top-bottom-10" ng-if="mode.isSingle">下拉框单选</div>
      <select ng-model="selectedData" ng-options="x for x in data"
              ng-change="selectItem(selectedData);" ng-if="mode.isSingle"></select>

      <div class="assertive-bg color-white padding-10 text-align-c margin-top-10" ng-click="finish();">完成选择</div>
    </div>
  </ion-content>
</ion-view>
